import React, { PureComponent } from 'react';
import { connect } from 'dva';
import moment from 'moment';
import { Form, Input, DatePicker, Modal, Checkbox } from 'antd';

const { Item: FormItem } = Form;
const TextArea = Input.TextArea;

const ModelName = 'receivable';
@connect(({ loading }) => ({
  loading: loading.models[ModelName],
}))
@Form.create()
class Comp extends PureComponent {
  constructor(props) {
    super(props);

    const { getInstance } = props;
    if (typeof getInstance === 'function') {
      getInstance(this);
    }
  }

  render() {
    const {
      form: { getFieldDecorator },
    } = this.props;
    const { receive, visible, onOk, onCancel } = this.props;

    const formLayout = {
      labelCol: {
        xs: { span: 5 },
        lg: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 15 },
        lg: { span: 15 },
      },
    };

    return (
      <Modal title={'核销'} destroyOnClose visible={visible} onOk={onOk} onCancel={onCancel}>
        <Form onSubmit={this.handleSubmit}>
          <FormItem label={receive.invoiceType == 3 ? '应付金额' : '应收金额'} {...formLayout}>
            {getFieldDecorator('amount', {
              initialValue: receive.amount,
            })(<Input addonAfter={receive.currecyName} disabled />)}
          </FormItem>
          <FormItem label={receive.invoiceType == 3 ? '实付金额' : '实收金额'} {...formLayout}>
            {getFieldDecorator('receive', {
              initialValue:
                receive.receive && receive.receive > 0 ? receive.receive : receive.amount,
            })(<Input addonAfter={receive.currecyName} />)}
          </FormItem>
          <FormItem label="核销" {...formLayout}>
            {getFieldDecorator('isRecLock', {
              initialValue: receive.isRecLock === 1,
              valuePropName: 'checked',
            })(<Checkbox />)}
          </FormItem>

          <FormItem label="核销日期" {...formLayout}>
            {getFieldDecorator('lockDate', {
              initialValue: moment(),
            })(<DatePicker />)}
          </FormItem>
          <FormItem label='备注' {...formLayout}>
            {getFieldDecorator('memo', {
              initialValue: receive.memo,
            })(<TextArea placeholder='备注' style={{ height: '7.5em' }} />)}
          </FormItem>
        </Form>
      </Modal>
    );
  }
}

export default Comp;
